<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>支付</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    <meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.
">
    <link rel="stylesheet" th:href="@{/lib/weui.min.css}">
    <link rel="stylesheet" th:href="@{/css/jquery-weui.css}">
</head>

<body ontouchstart>

<header class='demos-header'>
    <h1 class="demos-title"></h1>
</header>

<div class="weui-msg">
    <div class="weui-msg__text-area">
        <h1 class="weui-msg__title" th:text="${params.storeName}">门店名称</h1>
    </div>
    <div class="weui-form-preview">
        <div class="weui-form-preview__bd">
            <div class="weui-form-preview__item">
                <label class="weui-form-preview__label">价格</label>
                <span class="weui-form-preview__value" th:text="${params.totalFee} / 100" ></span>
            </div>
        </div>
    </div>
    <div class="weui-msg__opr-area">
        <p class="weui-btn-area">
            <a id="pay" class="weui-btn weui-btn_primary">支付</a>
        </p>
    </div>
</div>

<script th:src="@{/lib/jquery-2.1.4.js}"></script>
<script th:src="@{/lib/fastclick.js}"></script>
<script th:src="@{/js/jquery-weui.js}"></script>

<script>
    $(function () {
        FastClick.attach(document.body);
    });
</script>

<script th:inline="javascript">
    var appId = [[${params.appId}]];
    var timeStamp = [[${params.timeStamp}]];
    var nonceStr = [[${params.nonceStr}]];
    var prepayId = [[${params.prepayId}]];
    var sign = [[${params.sign}]];
    var signType = [[${params.signType}]];
    $(function () {
        $("#pay").click(function () {
            onBridgeReady();
        });
    })

    function onBridgeReady() {
        WeixinJSBridge.invoke(
            'getBrandWCPayRequest', {
                "appId": appId,
                "timeStamp": timeStamp,         //时间戳，自1970年以来的秒数
                "nonceStr": nonceStr, //随机串
                "package": "prepay_id=" + prepayId,
                "signType": signType,         //微信签名方式：
                "paySign": sign //微信签名
            },
            function (res) {
                console.log(res)
                if (res.err_msg == "get_brand_wcpay_request:ok") {
                    if (res.err_msg == "get_brand_wcpay_request:ok") {
                        WeixinJSBridge.invoke('closeWindow', {}, function (res) {
                        });
                    }
                }
            });
    }

    if (typeof WeixinJSBridge == "undefined") {
        if (document.addEventListener) {
            document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
        } else if (document.attachEvent) {
            document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
            document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
        }
    }else{
        onBridgeReady();
    }

</script>
</body>
</html>
